<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="zh">

<head>
    <meta charset="utf-8" />
    <title>CrossRun|谁与我大梦一场</title>
    <link rel="stylesheet" href="./css/style.css" />
    <link rel="stylesheet" href="./css/editormd.css" />
    <!-- <link rel="stylesheet" href="./css/s.css" /> -->
    <!-- <link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon" /> -->
</head>

<body>
    <div id="layout">
        <header>
            <select id="catSelect" class="submit_cat"> </select>
            <span id="add_cata" class="add_cata">+</span>
            <input id="title" placeholder="标题" class="submit_title" />
            <button id="get-md-btn" class="submit_btn">提交</button>
        </header>
        <div id="test-editormd">
            <textarea style="display:none;"></textarea>
        </div>
    </div>


    <script src="js/jquery-3.3.1.min.js"></script>
    <script src="./editormd.min.js"></script>
    <script type="text/javascript">
        var testEditor;

        $(function () {
            testEditor = editormd("test-editormd", {
                width: "90%",
                height: 1280,
                syncScrolling: "single",
                path: "./lib/"
            });

            /*
            // or
            testEditor = editormd({
                id      : "test-editormd",
                width   : "90%",
                height  : 640,
                path    : "../lib/"
            });
            */
        });

        $("#get-md-btn").bind('click', function () {
            var json = {
                "title": $("#title").val(),
                "content": testEditor.getMarkdown(),
                "cid": $("#catSelect").val()
            };
            $.ajax({
                contentType: 'application/json',
                type: 'POST',
                url: "/api/blog/add",
                dataType: "json",
                data: JSON.stringify(json),
                success: function (message) {
                    alert(message.resMessage);
                },
                error: function (message) {
                    console.log(message);
                    alert("提交数据失败！888" + message);

                }

            });

        });

        function getCatSelect() {
            $("#catSelect").empty()

            $.get("./api/catalog/list", function (result) {
                js = $.parseJSON(result);
                if (js.resCode == "1") {
                    for (var i = 0; i < js.Res.length; i++) {                        
                        $("#catSelect").append("<option value='" + js.Res[i].id + "'>" + js.Res[i].name + "</option>");
                    }
                }
            });
        }

        getCatSelect()

        $("#add_cata").click(function () {
            var a = prompt("请输入您的名字进行验证：", "");

            if (a == "" || $.trim(a).length == 0) {
                alert("输入不正确！");
            } else {
                add_cata(a)
            }

        });

        function add_cata(name) {
            var json = {
                "name": name
            };
            $.ajax({
                contentType: 'application/json',
                type: 'POST',
                url: "./api/catalog/add",
                dataType: "json",
                data: JSON.stringify(json),
                success: function (message) {                                        
                    $("#catSelect").append("<option value='" + message.Res.id + "'>" + message.Res.name + "</option>");
                },
                error: function (message) {
                    console.log(message);
                    alert("提交数据失败！" + message);
                }

            });
        }
    </script>
</body>

</html>